import React from 'react'
import propTypes from 'prop-types'
import Child from './child.js'
export default class Cont extends React.Component{
    //注入上下文信息
    static childContextTypes={
      msg:propTypes.string,
      change:propTypes.func
    }
    //上下文信息生命周期钩子
    getChildContext(){
        return {
            msg:this.state.msg,
            change:this.change
        }
    }
    constructor(){
        super()
        this.state={
            msg:'注入的上下文信息',
            num:0
        }
    }

    change=(val)=>{
       this.setState({
            msg:val,
            num:this.state.num+1
       })
    }
    render(){
        let {msg,num}=this.state
        return <>
            <p>----------------上下文信息通信-----------</p>
            <div>
                <p>注入到上下文中的信息：<span style={{color:"ff0"}}>{msg}</span> ---<span style={{color:'#01d326'}}>{num}</span>
                </p>
            </div>
            <p style={{borderTop:"1px solid red"}}>******************子组件*********************</p>
            <Child ></Child>
        
        </>
    }
}